<template>
  <div class="divv">
      <div class="content">
          <div class="left">
              <p><span class="remen">{{beike}}</span>{{title}}</p>
              <span class="os">{{text}}</span>
              <span class="os">{{time}}</span>
          </div>
          <div class="right">
              <img :src="imgurl">
              <span class="iconfont icon-huo ap">{{zan}}</span>
          </div>
      </div>
  </div>
</template>
<script>
export default {
    props:["title","beike","zan","text","time","imgurl"]
}
</script>

<style scoped>
.divv{
    width: 100%;
    height: 1.65rem;
    /* border: 1px solid blue; */
}
.content{
    width: 100%;
    height: 1.3rem;
    /* border: 1px solid red; */
    border-bottom: 1px solid #999999;
    padding: .16rem 0;
    display: flex;
}
.left{
    width: 2.1rem;
    height: 100%;
    /* background: coral; */
}
.left p{
    height: .95rem;
    font-size: .16rem;
    font-weight: 700;
}
.left p .remen{
    background: #ff5c5c;
    color: white;
    font-size: .1rem;
    margin-right: .06rem;
}
.left .os{
    margin-right: .13rem;
    color: #7a7a7a;
    font-size: .12rem;
} 
.right{
    flex: 1;
    height: 100%;
    background: cyan;
    position: relative;
}
.right img{
    width: 100%;
    height: 100%;
}
.right .ap{
    width: .5rem;
    height: .2rem;
    color: white;
    display: block;
    text-align: center;
    border-radius: .1rem;
    position: absolute;
    font-size: .08rem;
    line-height: .2rem;
    right: .12rem;
    bottom: .1rem;
    background: rgba(112, 74, 74, 0.4);
}
</style>